<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="index.css" rel="stylesheet" type="text/css"/>
<title>书迁——带着你的书签到处跑~</title>
</head>
<body>
    <div id="whole">
    <div id="main">
        <!-- 侧边栏 -->
        <div id="menu">
            <!-- 顶部菜单按钮 -->
            <div id="menu_slip"><b id="menu_slip_text">菜单</b></div>
            <br><br>
            <!-- 侧边分类按钮 -->
            <dl id="menu_category">
                <!-- 展示分类按钮的地方 ，由js代码获取数据后添加
                样板
                <dt class="category_button" value=0 >默认</dt>

                -->
            </dl>

            <dt class="category_button_add" id="category_button_add">
                <div id="category_button_add_text">
                    添加分类
                </div>
                <div id="category_button_add_control" style="display: none">
                    <input id="category_button_add_input"/><button id="category_button_add_commit">确定</button>
                </div>
            </dt>

            <p id="copyright">© 三五成群团队</p>
        </div>

    </div>

        <div id="right">
            <!-- 顶部 -->
            <div id="header" > 
                <img id="mark" src="../pic/书迁.png" alt="show">
                <h1 id="title">书迁</h1>
                <span>—— 带着你的书签到处跑~</span>
            </div>

            <!-- 文件夹内容 -->
            <div class="category_content" id="category_content">
                <div id="category_title">
                    <h2 id="category_name">默认</h2>
                        <img src="../pic/delete.png" class="category_del" id="category_del" width="15px" height="15px"/>
                </div>
                <dl id="category_tags" class="category_tags">

                    <!-- 样板
                    <dt class="tag_item">
                        <div class="tag">
                            <img class="tag_img" src="../pic/书签.png">
                            <a class="tag_url" href="https://www.w3school.com.cn/tags/index.asp">HTML标签参考手册</a>
                            <button class="tag_del">删除</button>
                        </div>
                        <br>
                    </dt>
                    -->
                </dl>
            </div>
        </div>


    <!-- 列表子项的html，js会从这里获取布局，然后加载数据， 修改布局请保持id和class-->
    <div id="category_html_import" style="display: none">
        <dt class="category_button" id="category_button">默认</dt><br>
    </div>

    <div id="tag_html_import" style="display: none">
        <dt class="tag_item">
            <div class="tag">
                <img class="tag_img" src="../pic/书签.png">
                <a class="tag_url" href="https://www.w3school.com.cn/tags/index.asp">HTML标签参考手册</a>
                <img src="../pic/delete.png" class="tag_del" width="15px" height="15px">
            </div>
            <br>
        </dt>
    </div>

</div>

    <!-- 依赖库和接口 -->
    <script type="text/javascript" src="../jquery-3.6.1.js" ></script>
    <script src="../api.js"></script>

    <script src="index.js"></script>

</body>
</html>